/* * @Author: wangsh  * @Date: 2019-05-11 19:45:53  */
import React, { Component } from 'react';
import { Card, Row, Col } from 'antd';

import './style.scss';

class Shape extends Component {
  render() {
    return (
      <div>
        <Row gutter={16}>
          <Col span={8}>
            <Card title="正方形" bordered={false}>
              <div className="square" />
            </Card>
          </Col>
          <Col span={8}>
            <Card title="长方形" bordered={false}>
              <div className="rectangle" />
            </Card>
          </Col>
          <Col span={8}>
            <Card title="圆形" bordered={false}>
              <div className="roundness" />
            </Card>
          </Col>
        </Row>
        <Row gutter={16} className="card-wrapp">
          <Col span={8}>
            <Card title="椭圆形" bordered={false}>
              <div className="oval" />
            </Card>
          </Col>
          <Col span={8}>
            <Card title="上三角" bordered={false}>
              <div className="downTriangle" />
            </Card>
          </Col>
          <Col span={8}>
            <Card title="下三角" bordered={false}>
              <div className="upTriangle" />
            </Card>
          </Col>
        </Row>
        <Row gutter={16} className="card-wrapp">
          <Col span={8}>
            <Card title="左三角" bordered={false}>
              <div className="leftTriangle" />
            </Card>
          </Col>
          <Col span={8}>
            <Card title="右三角" bordered={false}>
              <div className="rightTriangle" />
            </Card>
          </Col>
          <Col span={8}>
            <Card title="太极" bordered={false}>
              <div className="taiji" />
            </Card>
          </Col>
        </Row>
        <Row gutter={16} className="card-wrapp">
          <Col span={8}>
            <Card title="六角星" bordered={false}>
              <div className="startSix" />
            </Card>
          </Col>
          <Col span={8}>
            <Card title="心形" bordered={false}>
              <div className="heart" />
            </Card>
          </Col>
          <Col span={8}>
            <Card title="鸡蛋" bordered={false}>
              <div className="egg" />
            </Card>
          </Col>
        </Row>
        <Row gutter={16} className="card-wrapp">
          <Col span={6}>
            <Card title="晴天" bordered={false}>
              <div className="weather sunny" />
            </Card>
          </Col>
          <Col span={6}>
            <Card title="多云" bordered={false}>
              <div className="weather cloudy" />
            </Card>
          </Col>
          <Col span={6}>
            <Card title="下雨" bordered={false}>
              <div className="weather rainy" />
            </Card>
          </Col>
          <Col span={6}>
            <Card title="下雨" bordered={false}>
              <div className="weather snowy" />
            </Card>
          </Col>
        </Row>
      </div>
    );
  }
}

export default Shape;
